<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="../../../include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>小豆理财</title>

<link href="${ctx}/resources/media/css/chosen.css" rel="stylesheet"
	type="text/css" />
    <link rel="stylesheet" type="text/css" href="${ctx}/resources/media/css/bootstrap-wysihtml5.css" />
	<link rel="stylesheet" type="text/css"	href="${ctx}/resources/media/css/select2_metro.css" />
    <script type="text/javascript"
	src="${ctx}/resources/media/js/bootstrap-fileupload.js"></script>
<script type="text/javascript"
	src="${ctx}/resources/media/js/chosen.jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="${ctx}/resources/media/css/datetimepicker.css" />
    
</head>
<body>
	<div class="row-fluid profile">
		<div class="span12">
			<!--BEGIN TABS-->
			<div class="tabbable tabbable-custom tabbable-full-width">
				<ul class="nav nav-tabs">
					<li><a href="${ctx}/financing/xiaodou">产品列表</a></li>
					<li class="active"><a href="${ctx}/financing/xiaodou/form">产品修改</a></li>
				</ul>
				<div class="tab-content">
					<!--end tab-pane-->
					<div class="tab-pane profile-classic row-fluid active" id="tab_1_2">
						<div class="span12">
							<!-- BEGIN SAMPLE FORM PORTLET-->
							<div class="portlet box blue">
								<div class="portlet-title">
									<div class="caption">
										<i class="icon-reorder" style="text-align: right"></i> <span class="hidden-480"> 产品修改 </span>
									</div>
								</div>
								<!-- END SAMPLE FORM PORTLET-->
								<div class="portlet-body form ">
									<form class="form-horizontal" id="form" action="${ctx}/financing/xiaodou/save" method="post">
										<fieldset>
											<input id="loanIds" type="hidden" name="loanIds" value="${loanIds }">
											<input id="id" type="hidden" name="id"  value="${financing.id }">
											<input id="version" type="hidden" name="version"  value="${financing.version }">
											<input type="hidden" id="status"  value="${financing.status }">
                                            <h4 class="form-section">产品信息</h4>
                                            <div class="row-fluid">
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">编号</label>
                                                        <div class="controls">
                                                            <input type="text" id="code" name="code" class="m-wrap input-xlarge"  readonly="readonly" value="${financing.code }">
                                                            <span class="help-inline"></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">标题</label>
                                                        <div class="controls">
                                                            <input type="text" id="title" name="title" class="m-wrap input-xlarge" value="${financing.title }" maxlength="100">
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row-fluid">
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">选择小豆盒子</label>
                                                        <div class="controls">
                                                               <select id="term" name="term" class="select" style="width:285px" onclick="search()" >
                                                               <c:forEach items="${lists }" var="list">
                                                               <c:if test="${financing.term eq list.term }">
                                                             	  <option value=${list.term } selected="selected">${list.name }</option>
                                                               </c:if>
                                                               <c:if test="${financing.term ne list.term }">
                                                             	  <option value=${list.term } >${list.name }</option>
                                                               </c:if>
                                                               	
                                                               </c:forEach>
                                                            </select>
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">金额</label>
                                                        <div class="controls">
                                                            <input type="text" name="amount" id="amount" class="m-wrap input-xlarge" readonly="readonly" value="${financing.amount }">
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row-fluid">                   
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">最小投资金额</label>
                                                        <div class="controls">
                                                            <input type="text" name="minInvestAmount" id="minInvestAmount" class="m-wrap input-xlarge" value="${financing.minInvestAmount }" readonly="readonly" >
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                 <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">最大投资金额</label>
                                                        <div class="controls">
                                                            <input type="text" name="maxInvestAmount" id="maxInvestAmount" class="m-wrap input-xlarge"  value="${financing.maxInvestAmount }" readonly="readonly" >
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                     
                                            <div class="row-fluid">
                                                <div class="span6">
                                                    <div class="control-group">

                                                        <!-- Text input-->
                                                        <label class="control-label">收益率</label>
                                                        <div class="controls">
                                                            <input type="text" name="minProfitRate" id="minProfitRate" class="m-wrap input-xlarge" readonly="readonly">
                                                            <p class="help-block"></p>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="row-fluid">
                                                        <div class="span6">
                                                            <div class="control-group">
                                                                <!-- Text input-->
                                                                <label class="control-label">开始时间</label>
                                                                <div class="controls">
                                                                    <div class="input-append date form_meridian_datetime">
                                                                        <input size="16" type="text" id="start_time" name="startTime" value='<fmt:formatDate value="${financing.startTime }" pattern="yyyy-MM-dd HH:mm"/>'  class="m-wrap">
                                                                        <span class="add-on"><i class="icon-remove"></i></span>
                                                                        <span class="add-on"><i class="icon-calendar"></i></span>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="span6">
                                                            <div class="control-group">
                                                                <!-- Text input-->
                                                                <label class="control-label">结束时间</label>
                                                                <div class="controls">
                                                                    <div class="input-append date form_meridian_datetime">
                                                                        <input size="16" type="text" id="end_time" name="endTime" value='<fmt:formatDate value="${financing.endTime }" pattern="yyyy-MM-dd HH:mm"/>' class="m-wrap">
                                                                        <span class="add-on"><i class="icon-remove"></i></span>
                                                                        <span class="add-on"><i class="icon-calendar"></i></span>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    
                                               <div class="row-fluid  finance" >
                                                <div class="span12">
                                                    <h4 class="form-section">产品分期详情</h4>
                                                    <div class="control-group">
                                                        <table class="table table-striped table-bordered table-hover " id="dataTable">
										<thead>
											<tr >
												<th>选择</th>	
												<th>会员姓名</th> 											                                   			
                                      			<th>机构名称</th>                                      			  
                                      			<th>项目名称</th>
                                      			<th>贷款金额</th>
                                      			<th>首期费用</th>
                                      			<th>手续费率</th>
                                      			<th>手续费</th>
												<th>分期数</th>
                                                
											</tr>
										</thead>
										<tbody>
										</tbody>
									</table>
                                            </div>
                                                                                                     
                                          </div>                                              
                                           </div>
                                         
                                            
										</fieldset>
										<div class="form-actions">
											<button type="submit" class="btn blue ibtsubmit" id="btn1">
												<i class="icon-ok"></i> 保存
											</button>
                                            <button type="button" onclick="history.go(-1)" class="btn" id="btn2">取消</button>
										</div>
									</form>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!--END TABS-->
			</div>
		</div>
	</div>
	<script type="text/javascript" src="${ctx}/resources/media/js/jquery.dataTables.js"></script>
	<script type="text/javascript" src="${ctx}/resources/media/js/DT_bootstrap.js"></script>

    <script type="text/javascript"	src="${ctx}/resources/media/js/select2.min.js"></script>    
    <script type="text/javascript" src="${ctx}/resources/media/js/wysihtml5-0.3.0.js"></script>
    <script type="text/javascript" src="${ctx}/resources/media/js/bootstrap-wysihtml5.js"></script>
    <script type="text/javascript" src="${ctx}/resources/media/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="${ctx}/resources/media/js/form-wizard.js"></script>
    <script type="text/javascript" src="${ctx}/resources/media/js/jquery.validate.min.js"></script>
       <script type="text/javascript" src="${ctx}/resources/plugins/hashmap.js"></script>
    <script type="text/javascript">

    var dt;
	$(function() {

			
		$("select").select2();
		 FormWizard.init();

         if ($('.wysihtml5').size() > 0) {
             $('.wysihtml5').wysihtml5({
             });
         }

         $(".form_meridian_datetime").datetimepicker({
             format: "yyyy-m-d h:i",
             //showMeridian: true,
             language:"zh",
             autoclose: true,
             pickerPosition: (App.isRTL() ? "bottom-right" : "bottom-left"),
             todayBtn: true
         });
        
        dt = $('#dataTable')
				.dataTable(
						{
							"bLengthChange" : false,
							"bFilter" : true,
							"bInfo" : false,
							"iDisplayLength" : 20,
							"bSort" : false,
							"sDom" : "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
							"sPaginationType" : "bootstrap",
                            "bServerSide":true,
                            "sAjaxSource":"${ctx}/financing/xiaodou/loanData.json",
							"oLanguage" : {
								"oPaginate" : {
									"sPrevious" : "上一页",
									"sNext" : "下一页"
								}
							},
                            "aoColumns":[
                                {
                                    "mData":null,
                                    "fnRender":function(oObj){ 
                                    	var flag = false;
                                      
                                    	if(loanIds.indexOf(oObj.aData.id + ",") != -1){                                    		
                                    		flag = true;
                                    	}
                                    	var content = '<input type=\"checkbox\" name="chkItem"';
                                    	if(flag){
                                    		content += ' checked="checked" ';                                    		 
                                    	}
                                    	                                    
                                    	content += 'value=\"'+oObj.aData.id+'\" id=\"'+oObj.aData.id+'\" onClick="onCheckBoxChange(this)" />';
                                    	                                    	
                                        return content;
                                    }
                                },{
                                    "mData":"memberName"
                                },{
                                	"mData":"organizationName"
                                },{
                                	"mData":"projectName"
                                },{
                                	"mData":null,
                                	"fnRender":function(oObj){
                           
                                		return oObj.aData.loanAmount+'<input type="hidden" value="'+oObj.aData.loanAmount+'" id="amt_'+oObj.aData.id+'" />';
                                	}
                                },{
                                	"mData":"downPaymentDeposit"
                                },{
                                	"mData":"feeRate"
                                },{
                                	"mData":"fee"
                                },{
                                	"mData":"term"
                                }

                            ],
                            "fnServerData":function(sSource,aoData,fnCallback){
                                for(i in aoData){
                                    if(aoData[i].name == "sSearch"){
                                        aoData[i].name = "term";                                        
                                    }
                                   
                                }
                               
                                aoData.push({name:'term',value:$("#term").val()});  
                                aoData.push({name:'operationType',value:1});
                                aoData.push({name:'financingId',value:$("#id").val()});
                                                                
                                $.ajax({
                                    "dataType":'json',
                                    "type":'POST',
                                    "url":sSource,
                                    "data":aoData,
                                    "success":fnCallback
                                });
                            }
						});

		jQuery('#dataTable_wrapper .row-fluid:first').remove();
		jQuery('#dataTable_wrapper .dataTables_length select').addClass(
				"m-wrap small"); // modify table per page dropdown				
		search(1);
	});
	
	  function search(n){
		  
		  if(n != 1){			  
			  loanIds = '';
			  items.clear();
			  $("#amount").val(0.00);
              $("#maxInvestAmount").val(0.00);
              
		  }
		  var array = loanIds.split(",");
		  for(var i=0;i<array.length;i++){
			  if(items.search(array[i]) == null && array[i] != ""){
				  items.set(array[i],0);
			  }
		  }
		  
		  var term=$("#term").val();
          dt.fnFilter(term);    
         
          $.post("${ctx}/financing/xiaodou/rate/"+term,null,function(result){        	  
              if(result.success){
                $("#minProfitRate").val(result.rate);
               $("#minInvestAmount").val(result.minAmount);
              }
          },"json")
          
         
      }

  	  var loanIds =$("#loanIds").val();
  	  	var items = new HashMap();  	  
          function onCheckBoxChange(cbx){
        	var amt = Number($("#amount").val());
          	if($(cbx).attr("checked")){
          		items.set($(cbx).attr("id"),$("#amt_" + $(cbx).val()).val());    
          		amt +=  Number($("#amt_" + $(cbx).val()).val());          		
        	}else{
        			items.remove($(cbx).attr("id"));
        			amt -= Number($("#amt_" + $(cbx).val()).val());
        	}        	
          	 
          	loanIds = '';
          	items.forEach(function(key,value){          		
          		loanIds += value+',';

          	});
          	  $("#loanIds").val(loanIds);
              $("#amount").val(amt);
              $("#maxInvestAmount").val(amt);
                
          }
      
    </script>


</body>
</html>